
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style >
			p {
				width: 100px;
				height: 100px;
				color: white;
				font: 60px/100px Arial;
				/* 圆球半径 */
				border-radius: 50px;
				text-align: center;
				float: left;
				margin-left: 10px;
			}
			.red {
				background-color: red;
			}
			.blue {
				background-color: blue;
			}
		</style>
	</head>
	<body>
		<script>
			var redBalls = []
			for (let i = 0;i < 33;i+=1){
				redBalls.push(i+1)
			}
			var selectedBalls = []
			for (let i = 1;i <= 6;i += 1) {
				let index = parseInt(Math.random()*redBalls.length)
				selectedBalls.push(redBalls[index])		
				redBalls.splice(index,1)
			}
			selectedBalls.sort((x,y) => x-y)
			for (let i = 0; i < selectedBalls.length;i += 1) {
				let num = selectedBalls[i]
				document.write(`<p class="red">${num}</p>`)
			}
			let num = parseInt(Math.random() * 16 +1)
			document.write(`<p class="blue">${num}</p>`)  
		</script>
	</body>
</html>
